<template>
  <!-- 主播管理 -->
  <a-spin class="anchor-review" tip="加载中..." :spinning="isLoading">
    <!-- 筛选 -->
    <div class="filter new-filter">
      <div class="l search-box-item">
        <div>
          <span class="label-text-small">站点：</span>
          <a-select class="search-width-small" show-search :allowClear="true" placeholder="选择站点" v-model="search.locationName" @change="handleByQueryCond" :filter-option="filterOption">
            <a-select-option v-for="(item, index) in locationListData" :key="index + '-' + item.id" :value="item.city">{{ item.city }}</a-select-option>
          </a-select>
        </div>
        <div>
          <span class="label-text-small">高德ID：</span>
          <a-input-search class="search-width-small" type="text" placeholder="高德ID" allowClear v-model="search.gdId" @search="handleByQueryCond" />
        </div>
        <div>
          <span class="label-text-small">地址：</span>
          <a-input-search class="search-width-small" type="text" placeholder="地址" allowClear v-model="search.address" @search="handleByQueryCond" />
        </div>
        <div>
          <span class="label-text-small">POI名称：</span>
          <a-input-search class="search-width-small" type="text" placeholder="POI名称" allowClear v-model="search.name" @search="handleByQueryCond" />
        </div>
        <div>
          <span class="label-text-small">POI匹配状态：</span>
          <a-select class="search-width-small" placeholder="请选择状态" v-model="search.matchStatus" @change="handleByQueryCond">
            <a-select-option v-for="item in poiStatus" :key="item.value" :value="item.value">{{ item.name }}</a-select-option>
          </a-select>
        </div>
        <div>
          <span class="label-text-small">POI同步状态：</span>
          <a-select class="search-width-small" placeholder="请选择状态" v-model="search.isSync" @change="handleByQueryCond">
            <a-select-option v-for="item in poiSyncStatus" :key="item.value" :value="item.value">{{ item.name }}</a-select-option>
          </a-select>
        </div>
        <div>
          <span class="label-text-small">POI通过状态：</span>
          <a-select class="search-width-small" placeholder="请选择状态" v-model="search.materialStatus" @change="handleByQueryCond">
            <a-select-option v-for="item in materialStatus" :key="item.value" :value="item.value">{{ item.name }}</a-select-option>
          </a-select>
        </div>
        <div>
          <span class="label-text-small">资质审核时间：</span>
          <a-range-picker class="search-width-middle" @change="handleByQueryCond" v-model="search.selectDate" />
        </div>
      </div>
      <div class="search-new-r">
        <a-button type="primary" @click="handleByQueryCond" style="background:#1d6fe9">查询</a-button>
        <a-dropdown>
          <a-button class="ant-dropdown-link" type="danger" @click="(e) => e.preventDefault()"> 导入导出 <a-icon type="down" /> </a-button>
          <a-menu slot="overlay">
            <a-menu-item>
              <a
                type="primary"
                href="https://ll-oss-res.oss-cn-beijing.aliyuncs.com/excel/POI申请数据上传.xlsx?versionId=CAEQOxiBgMD7sq_A1xciIDBlNTlkZjc2ZjM4NDRjYTQ5NjY0NzBmZmE4N2FhMzIz"
                style="background:#ffc107;border-color:#ffc107;color:#fff;width:140px;border-radius:4px;margin:0 auto;"
                >POI申请模板</a
              >
            </a-menu-item>
            <a-menu-item>
              <a-upload name="file" accept=".xls,.xlsx" :action="actionUrl1" class="upload-btn" :headers="headers" @change="handleChange1" :showUploadList="false">
                POI申请数据上传
              </a-upload>
            </a-menu-item>
            <a-menu-item>
              <a-button type="primary" @click="exporAtata" style="background:#34C025;border-color:#34C025;">POI申请数据导出</a-button>
            </a-menu-item>
            <a-menu-item>
              <a-upload name="file" accept=".csv" :action="actionUrl2" class="upload-btn upload-btn1" :headers="headers" @change="handleChange2" :showUploadList="false">
                POI匹配数据上传
              </a-upload>
            </a-menu-item>
          </a-menu>
        </a-dropdown>
      </div>
    </div>

    <!-- 表格 -->
    <div class="main-body">
      <a-table :columns="tableColumns" :pagination="false" :data-source="poiList" :scroll="{ x: 900, y: tableHeight }" rowKey="id">
        <!-- 高德POI信息 -->
        <template slot="poiName" slot-scope="text, record">
          <p><span class="font-weight-bold">门店名称：</span>{{ record.poiName || '' }}</p>
          <p><span class="font-weight-bold">所属城市：</span>{{ record.city || '' }}</p>
          <p><span class="font-weight-bold">门店地址：</span>{{ record.address || '' }}</p>
          <p><span class="font-weight-bold">经度：</span>{{ record.longitude || '' }}</p>
          <p><span class="font-weight-bold">纬度：</span>{{ record.latitude || '' }}</p>
          <p v-if="record.gdId">
            <span class="font-weight-bold">高德POI_ID：</span><a :href="record.gdUrl || ''" target="_blank" v-if="record.gdUrl">{{ record.gdId || '' }}</a
            ><span v-else>{{ record.gdId || '' }}</span>
          </p>
        </template>
        <!-- 抖音POI信息 -->
        <template slot="bytePoiName" slot-scope="text, record">
          <p><span class="font-weight-bold">门店名称：</span>{{ record.bytePoiName || '' }}</p>
          <p><span class="font-weight-bold">门店类型：</span>{{ record.bytePoiTypeName || '' }}</p>
          <p><span class="font-weight-bold">所属城市：</span>{{ record.byteCity || '' }}</p>
          <p><span class="font-weight-bold">门店地址：</span>{{ record.byteAddress || '' }}</p>
          <p><span class="font-weight-bold">经度：</span>{{ record.byteLongitude || '' }}</p>
          <p><span class="font-weight-bold">纬度：</span>{{ record.byteLatitude || '' }}</p>
          <p v-if="record.poiId">
            <span class="font-weight-bold">抖音POI_ID：</span><a :href="record.bytePoiUrl || ''" target="_blank" v-if="record.bytePoiUrl">{{ record.poiId || '' }}</a
            ><span v-else>{{ record.poiId || '' }}</span>
          </p>
        </template>
        <!-- POI融合信息 -->
        <template slot="createTime" slot-scope="text, record">
          <p><span class="font-weight-bold">POI匹配申请时间：</span>{{ record.createTime || '' }}</p>
          <p><span class="font-weight-bold">POI匹配状态：</span>{{ record.matchStatusStr || '' }}</p>
          <p><span class="font-weight-bold">POI同步状态：</span>{{ record.isSyncStr || '' }}</p>
          <p><span class="font-weight-bold">已绑定SPU：</span>{{ record.bindProds || '无' }}</p>
          <p><span class="font-weight-bold">备注：</span>{{ record.matchStatusDesc || '' }}</p>
        </template>
        <!-- 商家资质图片 -->
        <template slot="urls" slot-scope="text, record">
          <div class="zzimg" style="display:flex" v-for="(item, index) in record.qualification" :key="index">
            <p v-for="(v, i) in urlName" :key="i" v-show="index === v.value" style="width:80px;text-align:right;">{{ v.name }} :&nbsp;</p>
            <div v-if="item && item.length > 0">
              <upload v-show="item && item.length > 0" :limit="item.length" disabled :value="item"> </upload>
            </div>
            <div v-else style="margin:0 0 3px 0;">无</div>
          </div>
        </template>
        <!-- 商家资质审核信息 -->
        <template slot="materialStatus" slot-scope="text, record">
          <div>
            <span class="font-weight-bold">商家资质审核状态：</span>
            <p v-for="(item, index) in materialStatus" :key="index">
              <span v-if="record.materialStatus === item.value">{{ item.name }}</span>
            </p>
          </div>
          <p><span class="font-weight-bold">商家资质提审时间：</span>{{ record.materialApplyTime || '' }}</p>
          <p><span class="font-weight-bold">过期时间：</span>{{ record.expirTime || '' }}</p>
          <div>
            <span class="font-weight-bold">资质审核拒绝描述：</span>
            <p v-for="(item, index) in record.materialList" :key="index">{{ index + 1 }} 、 {{ item }}</p>
          </div>
        </template>

        <template slot="action" slot-scope="text, record">
          <!--POI同步状态为“同步中”、“待同步”的POI提供“刷新”按钮，刷新POI同步状态  -->
          <a-button v-if="record.isSync === 0 || record.isSync === 1" type="link" href="javascript:;" size="small" @click="refreshStatus(record.id)">刷新</a-button><br />
          <!-- 对PO同步I状态未“已同步”、"同步失败"的POI提供“重置”按钮，使POI状态变为“待同步”； -->
          <a-button v-if="record.isSync === 2 || record.isSync === 3" type="link" href="javascript:;" size="small" @click="resetStatus(record.id)">重置</a-button><br />
          <!-- “编辑”，可对高德ID进行编辑 -->
          <a-button type="link" href="javascript:;" size="small" @click="editId(record)">编辑</a-button>
          <!-- “SPU信息” -->
          <a-button type="link" href="javascript:;" size="small" @click="toSpuList(record.id)">SPU信息</a-button>
          <!-- “资质上传” -->
          <a-button v-if="record.isSync === 2" type="link" href="javascript:;" size="small" @click="openUploadZZ(record.id, record.materialStatus)">资质上传</a-button>
          <!-- 授权书 -->
          <!-- <a-button type="link" href="javascript:;" size="small" v-if="record.isSync === 2 && record.poiId" @click="openHotelAuth(record.poiId)">授权书</a-button><br /> -->
          <!-- <a-button type="link" v-if="record.templateId" href="javascript:;" size="small" @click="openAuthReview(record.templateId)">预览</a-button><br v-if="record.templateId" /> -->
          <!-- 高德刷新 -->
          <a-button type="link" v-if="record.gdId" href="javascript:;" size="small" @click="gdUpdate(record)">高德更新</a-button>
          <!-- 抖音刷新 -->
          <a-button type="link" v-if="record.poiId" href="javascript:;" size="small" @click="dyUpdate(record)">抖音更新</a-button>
          <a-button v-if="(record.materialStatus === 3 || record.materialStatus === 2) && isApplyMaterial" type="link" href="javascript:;" size="small" @click="submitQualification(record.id)"
            >提交商家资质审核</a-button
          >
        </template>
      </a-table>
    </div>

    <!-- 分页 -->
    <div class="paging-container">
      <a-pagination
        :pageSize="search.pageSize"
        v-model="search.pageIndex"
        :total="pagination.total"
        showQuickJumper
        showLessItems
        :showTotal="(total) => `共 ${total} 条`"
        style="margin: 10px auto;"
        @change="handlePageChange"
      />
    </div>
    <!-- 编辑高德ID -->
    <a-modal class="copy-modal" width="500px" :footer="null" :visible="editShow" @cancel="editShow = false" title="编辑高德ID">
      <a-spin tip="提交中..." :spinning="isEditLoading">
        <a-form-model ref="gaodeForm" :model="gaodeForm" :rules="gaodeRule" :label-col="{ span: 4 }" :wrapper-col="{ span: 19 }">
          <a-row>
            <a-col :span="24">
              <a-form-model-item label="高德ID" prop="gdId"> <a-input v-model="gaodeForm.gdId" placeheloder="请输入高德ID"></a-input></a-form-model-item>
            </a-col>
          </a-row>
        </a-form-model>
        <div style="display:flex;justify-content: center;">
          <a-button type="primary" @click="submitEdit()" style="margin-right:20px;">提交</a-button>
        </div>
      </a-spin>
    </a-modal>
    <!-- 上传资质 -->
    <a-modal class="uploadZZModal" title="上传资质" :visible="uploadZZVisible" :confirm-loading="confirmZZLoading" @ok="handleUpload" @cancel="handleCancel">
      <a-form-model labelAlign="left" ref="updateZZForm" :model="updateZZForm" :label-col="{ span: 7 }" :wrapper-col="{ span: 14 }">
        <a-form-model-item :rules="{ required: true, message: '抖音上架商品与关联POI需上传营业执照，否则将无法过审', trigger: 'blur' }" :label="updateZZForm.qualification[0].name" prop="path">
          <upload :limit="1" v-model="updateZZForm.qualification[0].path" />
        </a-form-model-item>
        <span class="dscb">请上传高清正向完整大图，图片大小需小于4M</span>
        <a-form-model-item
          :rules="{ required: false, message: '部分行业抖音上架商品与关联POI需上传行业资质，否则将无法过审', trigger: 'blur' }"
          :label="updateZZForm.qualification[1].name"
          prop="path"
        >
          <upload v-model="updateZZForm.qualification[1].path" />
        </a-form-model-item>
        <span class="dscb">请上传高清正向完整大图，图片大小需小于4M</span>
        <a-form-model-item :rules="{ required: true, message: '抖音上架商品与关联POI需上传商家承诺函，否则将无法过审', trigger: 'blur' }" :label="updateZZForm.qualification[2].name" prop="path">
          <upload v-model="updateZZForm.qualification[2].path" />
        </a-form-model-item>
        <span class="dscb">请按页码顺序上传高清正向完整大图，图片大小之和需小于3.5M</span>
        <a-form-model-item :label="updateZZForm.qualification[3].name" prop="path">
          <upload v-model="updateZZForm.qualification[3].path" />
        </a-form-model-item>
        <a-form-model-item ref="name" label="其他补充资质" prop="name">
          <ul style="listStyle:none" v-for="(item, index) in updateZZForm.otherZZType" :key="index">
            <li>
              <span>{{ item.name }}</span>
              <upload v-model="item.path" />
            </li>
          </ul>
        </a-form-model-item>
        <a-form-model-item label="过期时间" prop="expirTime" :rules="{ required: true, message: '营业执照、行业资质、上架授权协议中最早到期时间，未填写将无法过审', trigger: 'change' }">
          <a-date-picker v-model="updateZZForm.expirTime" />
        </a-form-model-item>
        <span class="dscb">营业执照、行业资质、上架授权协议中最早到期时间，未填写将无法过审</span>
      </a-form-model>
    </a-modal>
    <hotel-auth @callback="handleByQueryCond()" :itemPoiId="itemPoiId" v-model="isShowHotelAuth"></hotel-auth>
  </a-spin>
</template>

<script>
import {
  poiListUrl,
  exportPoiInfo,
  ResetGdIdUrl,
  poiRefreshUrl,
  poiResetUrl,
  getCommonApiSearch,
  getPoiZZType,
  addOrUpdateZZ,
  getPoiNowZZDetail,
  getPotocolauth,
  poiRefreshDyPoi,
  poiRefreshGdPoi,
  syncMerchantQualificationReview
} from '@/service'
import upload from '../upload/upload.vue'
import hotelAuth from './component/hotelAuth'
import moment from 'moment'
import { columnsConfig } from '../columns'
import { BASE_URL, getExcel } from '@/util'
import { getToken } from '@/util/method'
import debounce from 'lodash/debounce'
export default {
  name: 'poiList',
  data() {
    this.getLocationList = debounce(this.getLocationList, 800)
    return {
      moment,
      gaodeForm: { gdId: '', id: '' },
      // loading是否显示
      isLoading: false,
      headers: {
        Authorization: getToken()
      },
      // POI申请数据上传
      actionUrl1: BASE_URL + '/anchor/platform/manager/poiData/upload/applyInfo',
      // POI匹配数据上传
      actionUrl2: BASE_URL + '/anchor/platform/manager/poiData/upload/resultInfo',
      // 编辑loading
      isEditLoading: false,
      pagination: {
        total: 0
      },
      // table数据查询条件
      search: {
        gdId: '',
        matchStatus: '',
        isSync: '',
        address: '',
        name: '',
        locationName: undefined,
        materialStatus: '',
        selectDate: [],
        pageIndex: 1,
        pageSize: 10
      },
      // 订单列表
      poiList: [],
      // 主播列表总数据条数
      anchorTotal: 0,
      tableColumns: columnsConfig.poiColumns || [],
      locationListData: [],
      // 编辑弹窗
      editShow: false,
      gaodeRule: {
        gdId: [
          { required: true, message: '请输入高德ID', trigger: 'blur' },
          {
            pattern: /^[a-zA-Z0-9_]*$/,
            message: '高德ID格式有误',
            trigger: 'blur'
          }
        ]
      },
      urlName: [
        { name: '营业执照', value: 'bizLicencePath' },
        { name: '行业许可证', value: 'qualMaterial' },
        { name: '商家授权函', value: 'contractPath' },
        { name: '商家证明', value: 'provePath' },
        { name: '其他资质', value: 'additionalQual' }
      ],
      updateZZForm: {
        qualification: [
          { code: 80, name: '营业执照', path: [] },
          { code: 70, name: '行业资质许可证', path: [] },
          { code: 50, name: '商家授权承诺函', path: [] },
          { code: 90, name: '商家证明' }
        ],
        otherZZType: [],
        expirTime: null
      },
      updateZZId: null,
      uploadZZVisible: false,
      confirmZZLoading: false,
      isShowHotelAuth: false,
      itemPoiId: '',
      isApplyMaterial: false
    }
  },

  components: {
    upload,
    hotelAuth
  },

  computed: {
    // 状态
    poiStatus() {
      return [
        {
          name: '全部',
          value: ''
        },
        {
          name: '等待匹配',
          value: 0
        },
        {
          name: '匹配中',
          value: 1
        },
        {
          name: '匹配成功',
          value: 2
        },
        {
          name: '匹配失败',
          value: 3
        }
      ]
    },
    poiSyncStatus() {
      return [
        {
          name: '全部',
          value: ''
        },
        {
          name: '待同步',
          value: 0
        },
        {
          name: '同步中',
          value: 1
        },
        {
          name: '已同步',
          value: 2
        },
        {
          name: '同步失败',
          value: 3
        }
      ]
    },
    materialStatus() {
      return [
        {
          name: '全部',
          value: ''
        },
        {
          name: '审核中',
          value: 0
        },
        {
          name: '审核通过',
          value: 1
        },
        {
          name: '审核拒绝',
          value: 2
        },
        {
          name: '未提交',
          value: 3
        },
        {
          name: '无资质',
          value: 4
        },
        {
          name: '协议已过期',
          value: 5
        }
      ]
    }
  },

  methods: {
    /**
     * 通过条件查询
     * @returns {void}
     */
    handleByQueryCond() {
      this.search.pageIndex = 1
      this.setPath(this.getParams())
      this.query()
    },

    filterOption(input, option) {
      return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
    },

    // 站点列表
    async getLocationList() {
      await getCommonApiSearch({ keywords: '' }).then((res = []) => {
        this.locationListData = res
      })
    },
    /**
     * 分页
     * @param {number} num 当前页码
     * @returns {void}
     */
    handlePageChange(num) {
      this.search.pageIndex = num
      this.setPath(this.getParams())
      this.query()
    },

    // 拿参数
    getParams() {
      // const { pageIndex, pageSize } = this.pagination
      const { matchStatus, isSync, address, name, gdId, locationName, materialStatus, selectDate = [], pageIndex, pageSize } = this.search

      return {
        pageIndex,
        pageSize,
        gdId,
        matchStatus,
        locationName,
        isSync,
        address,
        name,
        materialStatus,
        startTime: selectDate[0] ? moment(selectDate[0]).format('YYYY-MM-DD 00:00:00') : undefined,
        endTime: selectDate[1] ? moment(selectDate[1]).format('YYYY-MM-DD 23:59:59') : undefined
      }
    },
    // 设置搜索
    setSearch() {
      const { pageIndex, gdId, matchStatus, locationName, isSync, address, name, materialStatus, startTime, endTime } = this.$route.query
      const queryLen = Object.keys(this.$route.query).length
      if (queryLen) {
        console.log(this.$route.query, this.search, +isSync, isSync)
        this.search = {
          ...this.search,
          pageIndex: pageIndex ? Number(pageIndex) : 1,
          gdId: gdId || '',
          matchStatus: isNaN(matchStatus) ? '' : matchStatus === 0 ? '0' : +matchStatus,
          locationName: locationName || '',
          isSync: isNaN(isSync) ? '' : isSync === 0 ? '0' : +isSync,
          address: address || '',
          name: name || '',
          materialStatus: isNaN(materialStatus) ? '' : materialStatus === 0 ? '0' : +materialStatus,
          selectDate: startTime && endTime ? [startTime, endTime] : []
        }
        console.log(this.search)
      }
    },
    // 初始化
    initQuery() {
      // this.pagination.pageIndex = 1
      this.search.pageSize = 10
      this.setPath(this.getParams())
      this.query()
    },

    /**
     * 获取主播信息列表
     * 具体参数参考 getAnchorInfoListApi 方法
     * @returns {Promise<void>}
     */
    query() {
      this.isLoading = true
      poiListUrl(this.getParams())
        .then((rs) => {
          this.poiList = Object.freeze(rs.poiList) || []
          this.pagination.total = rs.total || 0
          this.isApplyMaterial = rs.isApplyMaterial
        })
        .finally(() => {
          this.isLoading = false
        })
    },
    // 储存搜索字段
    setPath(origin) {
      const { path } = this.$route
      const query = {}
      for (let key in origin) {
        if (origin[key] || origin[key] === 0) query[key] = origin[key]
      }
      if (query.pageIndex <= 1) delete query.pageIndex
      delete query.pageSize
      this.$router
        .replace({
          path,
          query: {
            ...query
          }
        })
        .catch(() => {})
    },
    // 刷新
    refreshStatus(id = '') {
      this.isLoading = true
      poiRefreshUrl({ id })
        .then((res) => {
          this.$messageSend.success('刷新成功')
        })
        .finally(() => {
          this.query()
          this.isLoading = false
        })
        .catch(() => {
          this.isLoading = false
        })
    },
    // 重置
    resetStatus(id = '') {
      this.isLoading = true
      poiResetUrl({ id })
        .then(() => {
          this.$messageSend.success('重置成功')
        })
        .finally(() => {
          this.query()
          this.isLoading = false
        })
        .catch(() => {
          this.isLoading = false
        })
    },
    // 编辑
    editId(item = {}) {
      const { id = '', gdId = '' } = item
      this.gaodeForm.gdId = gdId
      this.gaodeForm.id = id
      this.editShow = true
    },
    // 编辑提交
    submitEdit() {
      this.$refs.gaodeForm.validate((valid) => {
        if (valid) {
          this.isEditLoading = true
          ResetGdIdUrl(this.gaodeForm)
            .then((res) => {
              this.$messageSend.success('编辑成功')
            })
            .finally(() => {
              this.query()
              this.isEditLoading = false
              this.editShow = false
            })
            .catch(() => {
              this.isEditLoading = false
              this.editShow = false
            })
        }
      })
    },
    // 打开POI所绑定的SPU列表信息
    toSpuList(id = '') {
      // 外部商户ID
      this.$router.push({
        path: '/spuInfo',
        query: {
          id
        }
      })
    },
    // 导入-POI申请数据上传
    handleChange1(info = {}) {
      this.isLoading = true
      const { file = {} } = info
      const { status = '', response = '' } = file
      if (status === 'done') {
        if (response.code === 200) {
          this.isLoading = false
          this.$messageSend.success('上传成功')
          // getExcel(`POI${moment(new Date()).format('YY-MM-DD hh:mm:ss')}.xlsx`, response)
        } else {
          this.isLoading = false
          // this.$messageSend.error('上传失败')
          this.$success({
            title: '上传结果',
            content: response.data || '上传失败'
          })
        }
      } else if (status === 'error') {
        this.isLoading = false
        this.$messageSend.error('上传失败')
      }
    },
    // 导入-POI匹配数据上传
    handleChange2(info = {}) {
      this.isLoading = true
      const { file = {} } = info
      const { status = '', response = '' } = file
      if (status === 'done') {
        if (response.code === 200) {
          this.isLoading = false
          this.$messageSend.success('上传成功')
        } else {
          this.isLoading = false
          this.$messageSend.error('上传失败')
        }
      } else if (status === 'error') {
        this.isLoading = false
        this.$messageSend.error('上传失败')
      }
    },
    exporAtata() {
      exportPoiInfo(this.getParams())
        .then((res) => {
          getExcel(`POI匹配申请数据${moment(new Date()).format('YY-MM-DD hh:mm:ss')}.xlsx`, res)
        })
        .catch(() => {
          this.$messageSend.error('数据量过大！')
        })
    },
    exporModel() {},
    // 资质上传
    beforOpenUploadZZAsync(id) {
      getPoiZZType().then((res) => {
        this.updateZZForm.otherZZType = res
      })
      this.updateZZId = id
      getPoiNowZZDetail({ id: id }).then((res) => {
        const { expirTime, qualificationList } = res
        if (expirTime) this.updateZZForm.expirTime = expirTime
        if (qualificationList.length) {
          const arr1 = this.updateZZForm.qualification
          const arr2 = []
          qualificationList.forEach((item) => {
            if (item.code === 80) {
              arr1[0] = item || {}
            } else if (item.code === 70) {
              arr1[1] = item || {}
            } else if (item.code === 50) {
              arr1[2] = item || {}
            } else if (item.code === 90) {
              arr1[3] = item || {}
            }
          })
          if (arr1.length) this.updateZZForm.qualification = arr1
          qualificationList.forEach((item) => {
            if (item.code !== 90 && item.code !== 80 && item.code !== 70 && item.code !== 50) {
              arr2.push(item)
            }
          })
          this.updateZZForm.otherZZType.forEach((item) => {
            arr2.forEach((v) => {
              if (v.code === item.code && !item.path) {
                item.path = v.path
              }
            })
          })
        }
      })
      this.uploadZZVisible = true
    },
    openUploadZZ(id, materialStatus) {
      const _this = this
      if (materialStatus === 0) {
        this.$confirm({
          content: '商家资质正在审核中，若更新资质需重新提交审核',
          onOk: () => {
            _this.beforOpenUploadZZAsync(id)
          }
        })
      } else if (materialStatus === 1) {
        this.$confirm({
          content: '商家资质审核已通过，若更新资质需重新提交审核',
          onOk: () => {
            _this.beforOpenUploadZZAsync(id)
          }
        })
      } else {
        _this.beforOpenUploadZZAsync(id)
      }
    },
    handleUpload() {
      const { qualification, otherZZType } = this.updateZZForm
      const qualificationList = [...qualification, ...otherZZType].filter((item) => {
        return item.path !== undefined && item.path.length
      })
      const qureyData = { expirTime: moment(this.updateZZForm.expirTime).format('YYYY-MM-DD') + ' 23:59:59', flag: false, id: this.updateZZId, qualificationList: qualificationList }
      console.log(qureyData)
      addOrUpdateZZ(qureyData).then((res) => {
        this.$messageSend.success('上传成功')
        this.uploadZZVisible = false
        this.updateZZForm = {
          otherZZType: [],
          expirTime: null,
          qualification: [
            {
              code: 80,
              name: '营业执照',
              path: []
            },
            {
              code: 70,
              name: '行业资质许可证',
              path: []
            },
            {
              code: 50,
              name: '商家授权承诺函',
              path: []
            },
            {
              code: 90,
              name: '商家证明'
            }
          ]
        }
        this.initQuery()
      })
    },
    handleCancel() {
      this.$refs.updateZZForm.resetFields()
      this.updateZZForm = {
        otherZZType: [],
        expirTime: '',
        qualification: [
          {
            code: 80,
            name: '营业执照',
            path: []
          },
          {
            code: 70,
            name: '行业资质许可证',
            path: []
          },
          {
            code: 50,
            name: '商家授权承诺函',
            path: []
          },
          {
            code: 90,
            name: '商家证明'
          }
        ]
      }
      this.uploadZZVisible = false
    },
    openHotelAuth(id = '') {
      if (id) {
        this.itemPoiId = id
        this.isShowHotelAuth = true
      } else {
        this.$messageSend.error('暂时无法查看')
      }
    },
    openAuthReview(id = '') {
      getPotocolauth({ templateId: id }).then((res) => {
        window.open(res)
      })
    },
    // 高德刷新
    gdUpdate(row = {}) {
      const { id = '' } = row
      this.isLoading = true
      poiRefreshGdPoi({ id })
        .then((res) => {
          this.$messageSend.success('操作成功')
        })
        .finally(() => {
          this.query()
          this.isLoading = false
        })
        .catch(() => {
          this.isLoading = false
        })
    },
    // 抖音刷新
    dyUpdate(row = {}) {
      const { id = '' } = row
      this.isLoading = true
      poiRefreshDyPoi({ id })
        .then((res) => {
          this.$messageSend.success('操作成功')
        })
        .finally(() => {
          this.query()
          this.isLoading = false
        })
        .catch(() => {
          this.isLoading = false
        })
    },
    // 提交商家资质审核
    submitQualification(id = '') {
      const _this = this
      this.$confirm({
        title: '提交商家资质审核',
        content: '你确定要提交商家资质审核吗？',
        okText: '确定',
        okType: 'primary',
        onOk: () => {
          // 发送请求
          return syncMerchantQualificationReview({ poiIdList: [{ supplier_ext_id: id }] })
            .then((rs) => {
              _this.$confirm({
                content: rs,
                onOk() {
                  _this.query()
                },
                onCancel() {}
              })
            })
            .catch((err) => err)
        },
        onCancel() {}
      })
    }
  },

  mounted() {
    this.getLocationList()
    this.setSearch()
    this.initQuery()
    console.log(window)
  }
}
</script>

<style lang="less" scoped>
ul {
  padding-inline-start: 0;
  margin-bottom: 0;
}
.ant-col-7 {
  text-align: right;
}
.anchor-review {
  padding: 16px;
}

// 主播信息弹窗
.anchor-info {
  /deep/ .ant-modal-footer {
    border-top: none;
    padding-bottom: 36px;
    text-align: center;
  }

  //  描述列表样式覆盖
  /deep/ .ant-descriptions-view {
    .ant-descriptions-item-label {
      color: #666666;
    }

    .ant-descriptions-item-content {
      color: #333;
      vertical-align: text-top;
    }
  }
}
.color-f55 {
  color: #f55f4e !important;
}
.search-box {
  display: flex;
  justify-content: flex-start;
  width: 100%;
  flex-wrap: wrap;
  > div {
    margin-right: 15px;
    margin-bottom: 5px;
  }
}
.upload-btn {
  /deep/ .ant-upload {
    width: 140px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    background: #009688;
    border-color: #009688;
    color: #ffffff;
    border-radius: 4px;
  }
}
.upload-btn1 {
  /deep/ .ant-upload {
    background: #1d6fe9;
  }
}
.zzimg {
  /deep/.ant-upload-list-item-list-type-picture-card,
  /deep/.ant-upload-list-picture-card-container {
    width: 30px;
    height: 30px;
    margin: -6px 3px 6px 0;
    padding: 3px;
    border-radius: 2px;
  }
}
.ant-form-item {
  margin: 10px 0 0;
}
.dscb {
  color: red;
  margin-left: 10px;
  font-weight: bold;
  font-size: 12px;
}
p {
  margin-bottom: 5px;
  font-size: 13px;
}
.font-weight-bold {
  font-weight: bold;
  display: inline-block;
}

table tbody td div {
  margin-top: 2px;
}
/deep/ table tbody td a {
  margin-right: 0;
}
</style>
